<template>
  <div>
    <van-nav-bar
        title="标题"
        left-arrow
        @click-left="onClickLeft"
        @click-right="onClickRight">
      <template #right>
        <van-icon name="search" size="18"/>
      </template>
    </van-nav-bar>
    <router-view/>
    <van-tabbar v-model="active" @change="onChange" route>
      <van-tabbar-item to="/" icon="home-o">主页</van-tabbar-item>
      <van-tabbar-item to="/teampage" icon="search">队伍</van-tabbar-item>
      <van-tabbar-item to="/userpage" icon="friends-o">个人</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script setup>
import {showToast} from "vant";
import {ref} from "vue";
import {useRouter} from "vue-router";

const active = ref(0);
const router = useRouter();
const onClickLeft = () => history.back();
const onClickRight = () => {
  router.push("/searchpage")
};

const onChange = (index) => showToast(`标签 ${index}`);
</script>

<style scoped>

</style>
